<template>
  <div class="search">
    <x-header :left-options="{showBack: true,backText:'搜索'}" class="headerBox"></x-header>
    <search
      placeholder="输入相关信息"
      v-model="keyWord"
      position="absolute"
      auto-scroll-to-top
      top="46px"
      ref="search"
    ></search>
  </div>
</template>

<script>
import { XHeader, Search } from "vux";

export default {
  components: {
    XHeader,
    Search
  },
  data() {
    return {
      keyWord: ""
    };
  }
};
</script>

<style lang="less" scoped>
.search {
  /deep/.headerBox {
    background-color: #fff;
    border-bottom: 1px solid #eee;
    .vux-header-left {
      left: 24px;
      .vux-header-back {
        color: #000;
      }
      .left-arrow:before {
        border-color: #000;
      }
    }
  }
}
</style>